<header>
  <span id="title">{{ storeService.currentLanguage.mainTitle }}</span>
  <div style="float: right">
    {{ storeService.loginUser.Name }}({{ storeService.loginUser.Note }})
  </div>
</header>

<nav>
  <a href="#" (click)="switchModule('model')">{{
    storeService.currentLanguage.model
  }}</a>
  |
  <a href="#" (click)="switchModule('agg')">{{
    storeService.currentLanguage.aggregation
  }}</a>
  |
  <a href="#" (click)="switchModule('query')">{{
    storeService.currentLanguage.query
  }}</a>
  |
  <a href="#" (click)="switchModule('search')">{{
    storeService.currentLanguage.search
  }}</a>
  |
  <a href="#" (click)="switchModule('mrid')">{{
    storeService.currentLanguage.mridinfo
  }}</a>
</nav>

<fieldset *ngIf="storeService.actionType === 'agg'" style="max-width: 1800px">
  <legend>
    {{ storeService.currentLanguage.aggregation }}:{{
      storeService.aggregation.name
    }}
  </legend>
  <app-aggregation></app-aggregation>
</fieldset>

<fieldset
  *ngIf="storeService.actionType === 'search'"
  style="max-width: 1800px"
>
  <legend>{{ storeService.currentLanguage.search }}</legend>
  <app-query></app-query>
</fieldset>

<fieldset *ngIf="storeService.actionType === 'query'" style="max-width: 1800px">
  <legend>
    {{ storeService.currentLanguage.query }}:{{ storeService.query.name }}
  </legend>
  <app-advancedquery></app-advancedquery>
</fieldset>
<fieldset *ngIf="storeService.actionType === 'model'" style="max-width: 1800px">
  <legend>{{ storeService.currentLanguage.model }}</legend>
  <app-model></app-model>
</fieldset>
<fieldset *ngIf="storeService.actionType === 'mrid'" style="max-width: 1800px">
  <legend>{{ storeService.currentLanguage.mridinfo }}</legend>
  <app-mridview></app-mridview>
</fieldset>
<div style="text-align: right; font-size: smaller; margin-right: 10px">
  Version:{{ storeService.version }}
  <select [(ngModel)]="storeService.conf.language">
    <option value="cn">中文</option>
    <option value="en">English</option>
  </select>
</div>

<dx-load-panel
  #loadPanel
  shadingColor="rgba(0,0,0,0.4)"
  [position]="{ of: '#employee' }"
  [(visible)]="storeService.busyIndicatorVisible"
  [showIndicator]="true"
  [showPane]="true"
  [shading]="true"
  [closeOnOutsideClick]="false"
>
</dx-load-panel>
